﻿@inherits LayoutComponentBase
@implements IDisposable
@using System.Reflection
@using MatBlazor.Demo.Models
@using Microsoft.AspNetCore.Components
@inject AppModel AppModel
@inject UserAppModel UserAppModel
@inject IJSRuntime Js

<MatAnchorUtils></MatAnchorUtils>
<MatAppBar Style="z-index: 100;" Class="mat">
    <MatAppBarRow>
        <MatAppBarSection>
            <MatIconButton Icon="menu" OnClick="@((e) => MenuButtonClicked())"></MatIconButton>
            <MatAppBarTitle>MatBlazor - Material Design components for Blazor and Razor Components</MatAppBarTitle>
        </MatAppBarSection>
        <MatAppBarSection Align="@MatAppBarSectionAlign.End">
            <MatIconButton @ref="themeButton" Icon="invert_colors" OnClick="@OnClick">
            </MatIconButton>
            <MatIconButton Link="http://samprof.com" Target="_blank">
                <i class="fa fa-user-circle" aria-hidden="true"></i>
            </MatIconButton>
            <MatIconButton Link="https://github.com/SamProf/MatBlazor">
                <i class="fa fa-github" aria-hidden="true"></i>
            </MatIconButton>
            <MatMenu @ref="Menu" style="z-index: 100;">
                <ThemeColorSelector @bind-Value="@ThemePrimary"></ThemeColorSelector>
            </MatMenu>


        </MatAppBarSection>
    </MatAppBarRow>
</MatAppBar>

<MatDrawerContainer Style="width: 100vw; height: 100vh;" Class="mat">

    <MatHidden Breakpoint="@MatBreakpoint.SM" Direction="@MatHiddenDirection.Up" HiddenChanged="@ModelDrawerHiddenChanged">
        <ChildContent>
            <MatDrawer @bind-Opened="@_navMenuOpened" Mode="@MatDrawerMode.Modal">
                <MatAppBarAdjust></MatAppBarAdjust>
                <DemoDrawerContent></DemoDrawerContent>
            </MatDrawer>
        </ChildContent>
        <ElseContent>
            <MatDrawer @bind-Opened="@_navMenuOpened" Mode="@MatDrawerMode.Dismissible">
                <MatAppBarAdjust></MatAppBarAdjust>
                <DemoDrawerContent></DemoDrawerContent>
            </MatDrawer>
        </ElseContent>
    </MatHidden>


    <MatDrawerContent Style="padding-left: 25px; padding-right: 25px;">
        <MatAppBarAdjust></MatAppBarAdjust>
        @Body
    </MatDrawerContent>

</MatDrawerContainer>


<MatSnackbar @bind-IsOpen="@lazySnackbarIsOpen">
    <MatSnackbarContent>If you like MatBlazor, please put a star on GitHub.</MatSnackbarContent>
    <MatSnackbarActions>
        @* <MatButton Raised="true">Star</MatButton> *@
        <MatIconButton Icon="@MatIconNames.Stars" Link="https://github.com/BlazorComponents/MatBlazor" style="color: white;" target="_blank"></MatIconButton>
    </MatSnackbarActions>

</MatSnackbar>


@code {

    BaseMatIconButton themeButton;
    BaseMatMenu Menu;


    [CascadingParameter]
    MatTheme theme { get; set; }


    public string ThemePrimary
    {
        get { return theme.Primary; }
        set
        {
            theme.Primary = value;
            theme.ThemeHasChanged();
        }
    }


    protected void ModelDrawerHiddenChanged(bool hidden)
    {
        if (!hidden)
        {
            _navMenuOpened = false;
        }
    }

    public void OnClick(MouseEventArgs e)
    {
        this.Menu.OpenAsync(themeButton.Ref);
    }

    bool lazySnackbarIsOpen = false;

    bool _navMenuOpened = true;

    void MenuButtonClicked()
    {
        _navMenuOpened = !_navMenuOpened;
        this.StateHasChanged();
    }


    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        await base.OnAfterRenderAsync(firstRender);
    }

    protected async override Task OnInitializedAsync()
    {
        await base.OnInitializedAsync();

        Task.Delay(TimeSpan.FromSeconds(5))
            .ContinueWith((_) => { this.lazySnackbarIsOpen = true; });
    }

    public void Dispose()
    {
    }

}